import React from 'react';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Tabs } from 'antd';
import { FirstHeaderC, TenantC, ContentPackage } from '../../../comps';

// 组件引用
import BondInfo from './bondInfo';
import MoneyDirectFinancial from './moneyDirectFinancial';
import NonStandardMaintenance from './nonStandardMaintenance';
import AssetManagePlanInfo from './assetManagePlanInfo';
import FundInfo from './fundInfo';
import RepurchaseCounterparty from './repurchaseCounterparty';
import FinancialProduct from './financialProduct';
import { isIncluesRole, getUserInfo } from '../../../utils/commonFunc';
// 样式引用
import styles from './index.less';

const { TabPane } = Tabs;
const FormItemLayout = {
  labelCol: {
    span: 4,
  },
  wrapperCol: {
    span: 20,
  },
};
@Form.create()
class ManBankReport extends React.Component {
  constructor() {
    super();
    this.state = {
      activeKey: '1',
      tenant: isIncluesRole('GZHS') ? getUserInfo().tenantName : undefined, // 租户默认 无锡农商行
    };
  }

  componentDidMount() {
  }

  changeTab = (key) => {
    this.setState({
      activeKey: key,
    });
  };

  changeTabRefresh = (key) => {
    this.setState(
      {
        activeKey: key,
      },
      () => {
        setTimeout(() => {
          this.state.nonStandardRef.getTableData();
        }, 0);
      },
    );
  };

  // 切换租户
  changeTenant = (e) => {
    this.setState({
      tenant: e?.key,
    });
  };

  // 重置租户
  resetTenant = () => {
    this.setState({
      tenant: isIncluesRole('GZHS') ? getUserInfo().tenantName : undefined, // 租户默认 无锡农商行
    });
    this.props.form.setFieldsValue({ tenant: isIncluesRole('GZHS') ? getUserInfo().tenantName : undefined });
  };

  render() {
    const { activeKey, tenant } = this.state;
    const role = isIncluesRole('GZHS');
    return (
      <ContentPackage
        title='人行监管报表信息维护'
        contentHtml={
          <div>
            {/* 角色 “华泰估值核算”时，角色（code：GZHS）展示 */}
            {role ? (
              <div style={{ width: '300px' }}>
                <TenantC
                  form={this.props.form}
                  dataIndex='tenant'
                  onChange={this.changeTenant}
                  multiple={false}
                  formItemLayout={FormItemLayout}
                  initialValue={role ? getUserInfo().tenantName : undefined}
                />
              </div>
            ) : null}
            <div className={styles.tabCss}>
              <Tabs onChange={this.changeTab} activeKey={activeKey} type='card'>
                <TabPane  tab='债券信息维护' key='1'>
                  {<BondInfo tenant={tenant} resetTenant={this.resetTenant} />}
                </TabPane>
                <TabPane  tab='非标（理财直融）信息维护' key='2'>
                  {<MoneyDirectFinancial tenant={tenant} resetTenant={this.resetTenant} />}
                </TabPane>
                <TabPane  tab='非标（非理财直融）信息维护' key='3'>
                  {<NonStandardMaintenance tenant={tenant} resetTenant={this.resetTenant} onRef={(ref) => this.setState({ nonStandardRef: ref })} />}
                </TabPane>
                <TabPane  tab='资产管理计划和委外投资维护' key='4'>
                  {<AssetManagePlanInfo tenant={tenant} resetTenant={this.resetTenant} changeTabRefresh={this.changeTabRefresh} />}
                </TabPane>
                <TabPane  tab='基金信息维护' key='5'>
                  {<FundInfo tenant={tenant} resetTenant={this.resetTenant} />}
                </TabPane>
                <TabPane  tab='回购存续持仓' key='6'>
                  {<RepurchaseCounterparty tenant={tenant} resetTenant={this.resetTenant} />}
                </TabPane>
                <TabPane  tab='理财产品' key='7'>
                  {<FinancialProduct tenant={tenant} resetTenant={this.resetTenant} />}
                </TabPane>
              </Tabs>
            </div>
          </div>
        }
      />
    );
  }
}
export default ManBankReport;
